<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件-组件html模块</title>
</head>
<body>
    <div id="app">
        <div>
            <cool-qm></cool-qm>
        </div>
    </div>
    <!-- vue2 -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>
<!--    html的模板-->
    <template id="coolQm">
        <h2>{{coolhello}}-hello</h2>
    </template>
    <script>
        var coolQm = {
            name:"coolQm",
            data(){
                return{
                    coolhello:"cool hello world!"
                }
            },
            // template:"<h2>{{coolhello}}</h2>"
            template:"#coolQm"
        };

        var app = new Vue({
            el:"#app",
            data:{

            },
            components:{
                coolQm:coolQm
            }
        })
    </script>
</body>
</html>